<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>菜鸟教程(runoob.com)</title>
	</head>
	<body>

		<!--通过id查找html元素-->
		<p id="intro">你好世界!</p>
		<p>该实例展示了 <b>getElementById</b> 方法!</p>
		<script>
			x=document.getElementById("intro");
			document.write("<p>文本来自 id 为 intro 段落: " + x.innerHTML + "</p>");
		</script>

		<!--通过标签名查找html元素-->
		<p>你好世界!</p>
		<div id="main">
			<p> DOM 是非常有用的。</p>
			<p>该实例展示了  <b>getElementsByTagName</b> 方法</p>
		</div>
		<script>
			var x=document.getElementById("main");
			var y=x.getElementsByTagName("p");
			document.write('id="main"元素中的第一个段落为：' + y[0].innerHTML);
		</script>

		<!--通过类名找到html元素-->
		<p class="intro2">你好世界!</p>
		<p>该实例展示了 <b>getElementsByClassName</b> 方法!</p>
		<script>
			x=document.getElementsByClassName("intro2");
			document.write("<p>文本来自 class 为 intro2 段落: " + x[0].innerHTML + "</p>");
		</script>
		<p><b>注意：</b>Internet Explorer 8 及更早 IE 版本不支持 getElementsByClassName() 方法。</p>


	</body>
</html>
